<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" >

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/turbolinks/5.2.0/turbolinks.js" integrity="sha256-iM4Yzi/zLj/IshPWMC1IluRxTtRjMqjPGd97TZ9yYpU=" crossorigin="anonymous"></script>
  <link href="https://fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Cousine|Inconsolata" rel="stylesheet">
  <link rel="shortcut icon" type="image/png" href="/favicon.png">

  <link rel="stylesheet" href="/css/style.css">
  <link rel="stylesheet" href="/css/css/fontawesome-all.min.css">
  <link rel="stylesheet" href="/css/css/work-sans-v7.css">
  <script src="/js/main.js"></script>

  <!-- Begin Jekyll SEO tag v2.6.1 -->
<title>JS: Reblogging Post | Hive Developer</title>
<meta name="generator" content="Jekyll v4.0.0" />
<meta property="og:title" content="JS: Reblogging Post" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="By the end of this tutorial you should know how to reblog (resteem) a blog from steem" />
<meta property="og:description" content="By the end of this tutorial you should know how to reblog (resteem) a blog from steem" />
<link rel="canonical" href="reblogging_post.html" />
<meta property="og:url" content="reblogging_post.html" />
<meta property="og:site_name" content="Hive Developer" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2020-08-26T11:52:22-07:00" />
<script type="application/ld+json">
{"description":"By the end of this tutorial you should know how to reblog (resteem) a blog from steem","mainEntityOfPage":{"@type":"WebPage","@id":"reblogging_post.html"},"@type":"BlogPosting","url":"reblogging_post.html","headline":"JS: Reblogging Post","dateModified":"2020-08-26T11:52:22-07:00","datePublished":"2020-08-26T11:52:22-07:00","@context":"https://schema.org"}</script>
<!-- End Jekyll SEO tag -->


  
</head>
<body>
<header>
  <h1>
    <button type="button" class="open-nav" id="open-nav"></button>
    <a href="/"  class="logo-link"><img src="/images/logotype_black.svg" height="40" alt="Hive Developer logo"></a>
  </h1>

  
  <form action="/search/" method="get">
    <input type="text" name="q" id="search-input" placeholder="Search">
    <input type="submit" value="Search" style="display: none;">
  </form>
  

  <div id="sidebar" class="sidebar">
	
	
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/">
		<h6 class="ctrl-nav-section title">Introduction</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/#introduction-welcome">Welcome to Hive</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/quickstart/">
		<h6 class="ctrl-nav-section title">Quickstart</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/quickstart/#quickstart-choose-library">Choose Library</a></li>
						
					
						
						<li><a href="/quickstart/#quickstart-hive-full-nodes">Hive Nodes</a></li>
						
					
						
						<li><a href="/quickstart/#quickstart-testnet">Hive Testnet</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/tutorials/">
		<h6 class="ctrl-nav-section title">Tutorials</h6>
		<ul class="cont-nav-section content">
			
				
					
						<li><a href="/tutorials/#tutorials-javascript">Javascript</a></li>
					
				
					
						<li><a href="/tutorials/#tutorials-python">Python</a></li>
					
				
					
						<li><a href="/tutorials/#tutorials-ruby">Ruby</a></li>
					
				
					
						<li><a href="/tutorials/#tutorials-recipes">Recipes</a></li>
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/services/">
		<h6 class="ctrl-nav-section title">Services</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/services/#services-hive-blog">hive.blog</a></li>
						
					
						
						<li><a href="/services/#services-hivesigner">HiveSigner</a></li>
						
					
						
						<li><a href="/services/#services-jussi">Jussi</a></li>
						
					
						
						<li><a href="/services/#services-imagehoster">ImageHoster</a></li>
						
					
						
						<li><a href="/services/#services-dhf">DHF</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/apidefinitions/">
		<h6 class="ctrl-nav-section title">Appbase API</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/apidefinitions/#apidefinitions-condenser-api">Condenser Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-bridge">Bridge</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-account-by-key-api">Account By Key Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-account-history-api">Account History Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-block-api">Block Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-database-api">Database Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-debug-node-api">Debug Node Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-follow-api">Follow Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-jsonrpc">Jsonrpc</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-market-history-api">Market History Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-network-broadcast-api">Network Broadcast Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-rc-api">Rc Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-reputation-api">Reputation Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-rewards-api">Rewards Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-tags-api">Tags Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-transaction-status-api">Transaction Status Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-witness-api">Witness Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-broadcast-ops">Broadcast Ops</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-broadcast-ops-communities">Broadcast Ops Communities</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/resources/">
		<h6 class="ctrl-nav-section title">Resources</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/resources/#resources-overview">Overview</a></li>
						
					
						
						<li><a href="/resources/#resources-client-libs">Client Libraries</a></li>
						
					
						
						<li><a href="/resources/#resources-bluepaper">Bluepaper</a></li>
						
					
						
						<li><a href="/resources/#resources-whitepaper">Whitepaper</a></li>
						
					
						
						<li><a href="/resources/#resources-tools">Tools</a></li>
						
					
						
						<li><a href="/resources/#resources-hivesigner-libs">Hivesigner Libs</a></li>
						
					
						
						<li><a href="/resources/#resources-hive-keychain">Hive Keychain</a></li>
						
					
						
						<li><a href="/resources/#resources-developeradvocate">Community & Help</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/glossary/">
		<h6 class="ctrl-nav-section title">Glossary</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/glossary/#glossary-chain-basics">Chain Basics</a></li>
						
					
						
					
						
						<li><a href="/glossary/#glossary-governance">Governance</a></li>
						
					
						
						<li><a href="/glossary/#glossary-transactions">Transactions</a></li>
						
					
						
						<li><a href="/glossary/#glossary-api">API</a></li>
						
					
						
						<li><a href="/glossary/#glossary-market">Market</a></li>
						
					
				
			
		</ul>
	</section>
	
</div>



  <link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
</header>
<div class="main" id="top">
  <div class="hero">
    <h1 class="hero__h1">Hive Developer Portal </h1>
    <img class="hero__img" src="/images/honey-comb-92.png" style="position: relative; top: 10px;" />
  </div>
  <section id="tutorials-javascript-reblogging-post" class="row tutorials-javascript-reblogging-post">
	<h3>
		<a id="tutorials-javascript-reblogging-post">
			JS: Reblogging Post
			
		</a>
	</h3>
	
		<span class="description"><p><em>By the end of this tutorial you should know how to reblog (resteem) a blog from steem</em></p>
</span>
	

	<p><span class="fa-pull-left top-of-tutorial-repo-link"><span class="first-word">Full</span>, runnable src of <a href="https://gitlab.syncad.com/hive/devportal/-/tree/master/tutorials/javascript/tutorials/14_reblogging_post">Reblogging Post</a> can be downloaded as part of: <a href="https://gitlab.syncad.com/hive/devportal/-/tree/master/tutorials/javascript">tutorials/javascript</a>.</span>
<br /></p>

<p>This tutorial will show the method of obtaining the relevant inputs for the reblog process followed by broadcasting the info to the steem blockchain using a <code class="highlighter-rouge">demo</code> account on the <code class="highlighter-rouge">production server</code>.</p>

<h2 id="intro">Intro</h2>

<p>We are using the <code class="highlighter-rouge">client.broadcast</code> function provided by <code class="highlighter-rouge">dsteem</code> to reblog the selected blogpost. There are 4 variables that are required to perform this action:</p>

<ul>
  <li>The account name that is doing the reblog</li>
  <li>The private <em>posting</em> key of the account that is doing the reblog (this is not your main key)</li>
  <li>The author of the post that is being reblogged</li>
  <li>The title of the post that is being reblogged</li>
</ul>

<p>A simple HTML interface is used to capture the required information after which the transaction is submitted. There are two prerequisites within the reblog process in Steem that have to be adhered to, namely, the post must not be older than 7 days, and the post can only be reblogged once by a specific account. The fields have been populated with information to give an example of what it would look like but care has to be taken to provide correct details before the function is executed.</p>

<p>This tutorial makes use of the This function is taken from the tutorial <a href="https://github.com/steemit/devportal-tutorials-js/blob/master/tutorials/01_blog_feed/">Blog Feed</a> to get a list of trending posts.</p>

<h2 id="steps">Steps</h2>

<ol>
  <li><a href="#configure_connection"><strong>Configure connection</strong></a> Configuration of <code class="highlighter-rouge">dsteem</code> to use the proper connection and network.</li>
  <li><a href="#collecting_information"><strong>Collecting information</strong></a> Generating relevant posting information with an HTML interface.</li>
  <li><a href="#broadcasting_the_reblog"><strong>Broadcasting the reblog</strong></a> Assigning variables and executing the reblog.</li>
</ol>

<h4 id="1-configure-connection">1. Configure connection**<a name="configure_connection"></a></h4>

<p>Below we have <code class="highlighter-rouge">dsteem</code> pointing to the production network with the proper chainId, addressPrefix, and endpoint. Although this tutorial is interactive, we will not post to the testnet due to the prerequisites of reblogging.
There is a <code class="highlighter-rouge">public/app.js</code> file which holds the Javascript segment of this tutorial. In the first few lines we define the configured library and packages:</p>

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">const</span> <span class="nx">dsteem</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="dl">'</span><span class="s1">dsteem</span><span class="dl">'</span><span class="p">);</span>

<span class="c1">//define network parameters</span>
<span class="kd">let</span> <span class="nx">opts</span> <span class="o">=</span> <span class="p">{};</span>
<span class="nx">opts</span><span class="p">.</span><span class="nx">addressPrefix</span> <span class="o">=</span> <span class="dl">'</span><span class="s1">STM</span><span class="dl">'</span><span class="p">;</span>
<span class="nx">opts</span><span class="p">.</span><span class="nx">chainId</span> <span class="o">=</span>
    <span class="dl">'</span><span class="s1">0000000000000000000000000000000000000000000000000000000000000000</span><span class="dl">'</span><span class="p">;</span>
<span class="c1">//connect to a Steem node. This is currently setup on production, but we recommend using a testnet like https://testnet.steem.vc</span>
<span class="kd">const</span> <span class="nx">client</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">Client</span><span class="p">(</span><span class="dl">'</span><span class="s1">https://api.steemit.com</span><span class="dl">'</span><span class="p">,</span> <span class="nx">opts</span><span class="p">);</span>
</code></pre></div></div>

<h4 id="2-collecting-information">2. Collecting information<a name="collecting_information"></a></h4>

<p>Next we have the <code class="highlighter-rouge">submitPost</code> function that collects the required fields for the reblog process via an HTML interface
after wich we assign them to variables for use later.</p>

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1">//this function will execute when the HTML form is submitted</span>
<span class="nb">window</span><span class="p">.</span><span class="nx">submitPost</span> <span class="o">=</span> <span class="k">async</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="p">{</span>
    <span class="c1">//get private key</span>
    <span class="kd">const</span> <span class="nx">privateKey</span> <span class="o">=</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">PrivateKey</span><span class="p">.</span><span class="nx">fromString</span><span class="p">(</span>
        <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">postingKey</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span>
    <span class="p">);</span>
    <span class="c1">//get account name</span>
    <span class="kd">const</span> <span class="nx">myAccount</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">username</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">;</span>
    <span class="c1">//get blog author</span>
    <span class="kd">const</span> <span class="nx">theAuthor</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">theAuthor</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">;</span>
    <span class="c1">//get blog permLink</span>
    <span class="kd">const</span> <span class="nx">thePermLink</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">thePermLink</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">;</span>
</code></pre></div></div>

<h4 id="3-broadcasting-the-reblog">3. Broadcasting the reblog<a name="broadcasting_the_reblog"></a></h4>

<p>Finally we create two variables to simply the <code class="highlighter-rouge">client.broadcast</code> function line and broadcast the reblog instruction.</p>

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">const</span> <span class="nx">jsonOp</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">([</span>
    <span class="dl">'</span><span class="s1">reblog</span><span class="dl">'</span><span class="p">,</span>
    <span class="p">{</span>
        <span class="na">account</span><span class="p">:</span> <span class="nx">myAccount</span><span class="p">,</span>
        <span class="na">author</span><span class="p">:</span> <span class="nx">theAuthor</span><span class="p">,</span>
        <span class="na">permlink</span><span class="p">:</span> <span class="nx">thePermLink</span><span class="p">,</span>
    <span class="p">},</span>
<span class="p">]);</span>

<span class="kd">const</span> <span class="nx">data</span> <span class="o">=</span> <span class="p">{</span>
    <span class="na">id</span><span class="p">:</span> <span class="dl">'</span><span class="s1">follow</span><span class="dl">'</span><span class="p">,</span>
    <span class="na">json</span><span class="p">:</span> <span class="nx">jsonOp</span><span class="p">,</span>
    <span class="na">required_auths</span><span class="p">:</span> <span class="p">[],</span>
    <span class="na">required_posting_auths</span><span class="p">:</span> <span class="p">[</span><span class="nx">myAccount</span><span class="p">],</span>
<span class="p">};</span>

<span class="nx">client</span><span class="p">.</span><span class="nx">broadcast</span><span class="p">.</span><span class="nx">json</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">privateKey</span><span class="p">).</span><span class="nx">then</span><span class="p">(</span>
    <span class="kd">function</span><span class="p">(</span><span class="nx">result</span><span class="p">)</span> <span class="p">{</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="dl">'</span><span class="s1">client broadcast result: </span><span class="dl">'</span><span class="p">,</span> <span class="nx">result</span><span class="p">);</span>
    <span class="p">},</span>
    <span class="kd">function</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="p">{</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">error</span><span class="p">(</span><span class="nx">error</span><span class="p">);</span>
    <span class="p">}</span>
<span class="p">);</span>
</code></pre></div></div>

<p>There are also two <code class="highlighter-rouge">console</code> functions an a ui output under <strong>Resteem Results</strong> defined in order to track if the reblog
as successful or not. If the broadcast succeeds the <code class="highlighter-rouge">console.log</code> will show the following:</p>

<p>client broadcast result:</p>

<div class="highlighter-rouge"><div class="highlight"><pre class="highlight"><code>{
    id: "f10d69ac521cf34b0f5d18d938e68c89e77bb31d",
    block_num: 22886453,
    trx_num: 35,
    expired: false
}
</code></pre></div></div>

<p>This indicates the block number at which the broadcast was sent as well as the transaction ID for the reblog.</p>

<p>If the reblog fails the <code class="highlighter-rouge">console.log</code> will present a long line of error code:</p>

<div class="highlighter-rouge"><div class="highlight"><pre class="highlight"><code>{
    name: "RPCError",
    jse_shortmsg: "blog_itr == blog_comment_idx.end(): Account has already reblogged this post",
    jse_info: {
        ode: 10,
        name: "assert_exception",
        message: "Assert Exception",
        stack: Array(6)
    },
    message: "blog_itr == blog_comment_idx.end(): Account has already reblogged this post",
    stack: "RPCError: blog_itr == blog_comment_idx.end(): Acco…lled (http://localhost:3000/bundle.js:440:690874)"
}
</code></pre></div></div>

<p>There is a line in the error log indicating “Account has already reblogged this post” indicating exactly that. This process can be run until a positive result is found.</p>

<p>It should be noted that reblogging a post does not create a new post on the blockchain but merely shares the post to whomever is following the user doing the reblog. Along with <code class="highlighter-rouge">reblogging</code> the <code class="highlighter-rouge">custom_json</code> broadcast operation also includes options for following users and editing blog content. More information on how to use the <code class="highlighter-rouge">broadcast</code> operation and options surrounding the operation can be found on the Steem <a href="https://developers.steem.io/apidefinitions/#apidefinitions-broadcast-ops-comment">Devportal</a></p>

<h2 id="to-run-this-tutorial">To run this tutorial</h2>

<ol>
  <li><code class="highlighter-rouge">git clone https://gitlab.syncad.com/hive/devportal.git</code></li>
  <li><code class="highlighter-rouge">cd devportal/tutorials/javascript/14_reblogging_post</code></li>
  <li><code class="highlighter-rouge">npm i</code></li>
  <li><code class="highlighter-rouge">npm run dev-server</code> or <code class="highlighter-rouge">npm run start</code></li>
  <li>After a few moments, the server should be running at http://localhost:3000/</li>
</ol>

<hr />

</section>

</div>
<div class="footer">
  <a href="#">Back to top</a>
</div>
<script>
    document.getElementById("open-nav").addEventListener("click", function () {
        document.body.classList.toggle("nav-open");
    });
</script>
</body>
</html>


<script src="/js/adjust.js"></script>

